import { ref } from 'vue';
import { useRoute,onBeforeRouteUpdate,useRouter } from 'vue-router';
import { useCookies } from "@vueuse/integrations/useCookies"
import { router } from "~/router";

// const route = useRoute()
// const router = useRouter()
// const cookie = useCookies()

// const activeTab = ref(route.path);
// const tabList = ref([
//     {
//         title: '后台首页',
//         path:"/"
//     }
// ]);

// function addTab(tab){
//     let noTab = tabList.value.findIndex(t=>t.path == tab.path) == -1
//     if(noTab){
//         tabList.value.push(tab)
//     }
//     cookie.set("tabList",tabList.value)
// }

// function initTabList(){
//     let tbs = cookie.get("tabList")
//     if(tbs){
//         tabList.value = tbs
//     }
// }

// onBeforeRouteUpdate((to, from) => {
//     activeTab.value = to.path
//     addTab({
//         title: to.meta.title,
//         path: to.path
//     });
// })

// const changeTab = (t) => {
//     activeTab.value = t
//     router.push(t)
// }

// const removeTab = (targetName) => {
//     const index = tabList.value.findIndex(item => item.path === targetName);
//     if (index > -1) {
//         tabList.value.splice(index, 1);
//         cookie.set("tabList", tabList.value);
//         if (activeTab.value === targetName) {
//             if (tabList.value.length > 0) {
//                 const newActiveTab = tabList.value[tabList.value.length - 1].path;
//                 activeTab.value = newActiveTab;
//                 router.push(newActiveTab);
//             } else {
//                 router.push('/');
//             }
//         }
//     }
// };

// const handleClose = (c)=>{
// 	if(c == "clearAll"){
// 		activeTab.value="/"
// 		tabList.value = [{
// 			title: '后台首页',
// 			path:"/"
// 		}]
// 	}else if(c == "clearOther"){
// 		tabList.value = tabList.value.filter(tab=>tab.path == "/" || tab.path == activeTab.value)
// 	}
// 	cookie.set("tabList",tabList.value)
// }

export function useTabList() {
	const route = useRoute()
	const router = useRouter()
	const cookie = useCookies()

	const activeTab = ref(route.path);
	const tabList = ref([{
		title: '后台首页',
		path: "/"
	}]);

	function addTab(tab) {
		let noTab = tabList.value.findIndex(t => t.path == tab.path) == -1
		if (noTab) {
			tabList.value.push(tab)
		}
		cookie.set("tabList", tabList.value)
	}

	function initTabList() {
		let tbs = cookie.get("tabList")
		if (tbs) {
			tabList.value = tbs
		}
	}

	onBeforeRouteUpdate((to, from) => {
		activeTab.value = to.path
		addTab({
			title: to.meta.title,
			path: to.path
		});
	})

	const changeTab = (t) => {
		activeTab.value = t
		router.push(t)
	}

	const removeTab = (targetName) => {
		const index = tabList.value.findIndex(item => item.path === targetName);
		if (index > -1) {
			tabList.value.splice(index, 1);
			cookie.set("tabList", tabList.value);
			if (activeTab.value === targetName) {
				if (tabList.value.length > 0) {
					const newActiveTab = tabList.value[tabList.value.length - 1].path;
					activeTab.value = newActiveTab;
					router.push(newActiveTab);
				} else {
					router.push('/');
				}
			}
		}
	};

	const handleClose = (c) => {
		if (c == "clearAll") {
			activeTab.value = "/"
			tabList.value = [{
				title: '后台首页',
				path: "/"
			}]
		} else if (c == "clearOther") {
			tabList.value = tabList.value.filter(tab => tab.path == "/" || tab.path == activeTab.value)
		}
		cookie.set("tabList", tabList.value)
	}
return{
	activeTab,tabList,changeTab,removeTab,handleClose
}
}